/*
* @Author: lenovo
* @Date:   2017-12-07 19:59:09
* @Last Modified by:   lenovo
* @Last Modified time: 2017-12-12 10:32:36
*/
/*@media (min-width: 320px){html{font-size: 32px;} }
@media (min-width: 360px){html{font-size: 36px;} }
@media (min-width: 375px){html{font-size: 37.5px;} }
@media (min-width: 384px){html{font-size: 38.5px;} }
@media (min-width: 414px){html{font-size: 41.4px;} }
@media (min-width: 448px){html{font-size: 44.8px;} }
@media (min-width: 480px){html{font-size: 48px;} }
@media (min-width: 512px){html{font-size: 51.2px;} }
@media (min-width: 544px){html{font-size: 54.4px;} }
@media (min-width: 576px){html{font-size: 57.6px;} }
@media (min-width: 608px){html{font-size: 60.8px;} }
@media (min-width: 640px){html{font-size: 64px;} }
@media (min-width: 750px){html{font-size: 75px;} }
@media (min-width: 800px){html{font-size: 80px;} }
@media (min-width: 1024px){html{font-size: 102.4px;} }*/
/*lanse rgb(48, 69, 90)
honhse rgb(162, 35, 80)*/
*{
	margin:0;
	padding: 0;
}
li{
	list-style: none;
}
a{
	text-decoration: none;
}
body{
	/*height:100%;*/
}
.wrap{
	color:rgb(1, 35, 60);
	width: 100%;
	/*border:1px solid blue;*/
}
.wrap .bg-div{
	width: 100%;
	height: 100%;
	/*border:1px solid blue;*/
	overflow: hidden;
	transition: all 500ms;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-image: url(../images/bg6.jpg);
}
.wrap .bg-div .nav{
	width: 100%;
	height: 70px;
	/*border:1px solid blue;*/
	transition: all 500ms;
	background-color: rgba(51, 134, 179,.2);
	color: wheat;
	font-size: 0.5rem;
}
.wrap .bg-div .nav .nav-ul{
	width: 100%;
	height: 100%;
	background-color: transparent;
}
.wrap .bg-div .nav .nav-ul li{
	box-sizing: border-box;
	height: 70px;
	line-height: 70px;
	cursor: pointer;
	float: left;
	text-align: center;
	background-color: transparent;
	transition:all 500ms;
	font-size:16px;
}
.wrap .bg-div .nav .nav-ul .main-nav-li:hover{
	border-bottom:0.1rem solid rgb(1, 35, 60);
	transform: translateY(-2px);

	border-color: pink;
}
.wrap .bg-div .nav .nav-ul .logo-li{
	background-image: url(../images/logoeye.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	/*font-size: 0.6rem;*/
	color:rgb(1, 35, 60);
	/*font-weight: bolder;*/
	cursor: default;
}
/*主体部分*/
.wrap .bg-div .main-wrap{
	width: 100%;
	/*height: 100%;*/
}

/*内容部分*/
.wrap .bg-div .main-wrap .content{
	position: absolute;
	width: 100%;
	/*height: 9rem;*/
}
.wrap .bg-div .main-wrap .content .part{
	text-align: center;
	height: 100%;
	float: left;
	/*border:1px solid black;*/
	box-sizing: border-box;
	color:white;
	box-shadow: 3px 4px  10px 10px rgba(0,0,0,.3);
	/*overflow: hidden;*/
}
.wrap .bg-div .main-wrap .content .part-content{
	/*position: relative;*/
	cursor: pointer;
	text-align: center;
	height: 100%;
	/*border:1px solid blue;*/
	box-sizing: border-box;
	/*background-color: rgba(36, 20, 65,.7);*/
	transition: all 500ms;
	/*padding-top: 20px;*/
	background-repeat: no-repeat;
	background-size: 100% 100%;
	/*transition: all 500ms;*/
}
.wrap .bg-div .main-wrap .content .part-content h3{
	box-sizing: border-box;
	line-height: 0.7rem;
	width: 100%;
	height: 0.8rem;
	border: 0.08rem solid rgb(242,242,242);
	margin:0;
	/*background-color: rgba(51, 134, 179,.9);*/
	background-color: white;
	border-radius: 0.3rem;
	color:rgb(42, 48, 60);
	cursor: default;
	font-weight: bolder;
	margin-top: 0.7rem;
	transition: all 500ms;
	font-size: 0.3rem;
}
.wrap .bg-div .main-wrap .content .part-content .desc{
	position: absolute;
	box-sizing: border-box;
	/*padding: 0.84rem;*/
	background-color: rgb(0, 11, 34);
	/*border-radius: 1rem;*/
	color:rgb(242, 248, 260);
	transition: all 500ms;
	font-size: 0.16rem;
	overflow: hidden;
	display: none;
}
.wrap .bg-div .main-wrap .content .part-content .desc p{
	margin:0;
}
.desc-one{
	
	display: block;
}
.wrap .bg-div .main-wrap .content .part-content .desc a{
	color:rgb(205,205,205);
}
.wrap .bg-div .main-wrap .content .part-content .desc a:hover{
	color:pink;
}
/*.wrap .bg-div .main-wrap .content .part-content .desc:hover{
	transform: translateY(-70px);
	height: 170px;
	overflow: none;
}*/
/*点击进入任何一个栏目时endwrap出现，然后跳转*/
canvas{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 10;
	background-color: transparent;
	/*height: 600px;*/
}
.filter {
	position:absolute;
	top:0;
	left:0;
	background:#fe5757;
	animation:colorChange 30s ease-in-out infinite;
	animation-fill-mode:both;
	mix-blend-mode:overlay;
	width: 100%;
	/*height:600px;*/
}
@keyframes colorChange {
	0%,100% {
		opacity:0;
	}
	50% {
		opacity:.9;
	}
}
.landscape {
	width:100%;
	position:absolute;
	bottom:0px;
	left:0;
	/*height: 600px;*/
}
.forward{
	    z-index: 100;
    position: absolute;
}
.circle-img-wrap{
	position: absolute;
	animation: imgRotateZ  10s ease  infinite;
}
.circle-img,.circle-img-wrap{

	border-radius: 50% 50%;
	background-size: contain;
	background-repeat: repeat;
	background-position: center;
	/*margin:0 auto;*/
}
.circle-img{
/*	border-radius: 50% 50%;
	background-size: contain;
	background-repeat: repeat;
	background-position: center;*/
}
.menu{
	display: none;
}
@media (max-width: 544px){
	/*小于544*/
	.wrap .bg-div .nav{
	width: 10rem;
	height: 1.2rem;
	/*border:1px solid blue;*/
	transition: all 500ms;
	background-color: black;
	color: wheat;
	font-size: 0.5rem;
	position: fixed;
}
.wrap .bg-div .nav .nav-ul{
	width: 100%;
	height: 100%;
	background-color: transparent;
	display: none;
	transition: all 500ms;
}
.wrap .bg-div .nav .nav-ul li{
	width: 100%;
	box-sizing: border-box;
	height: 1.2rem;
	line-height: 1.2rem;
	cursor: pointer;
	/*float: left;*/
	text-align: center;
	background-color: rgb(30,30,30);
	transition:all 500ms;
	font-size:0.5rem;
}
.wrap .bg-div .nav .nav-ul .main-nav-li:hover{
	border-bottom: 0rem solid rgb(1, 35, 60);
    transform: translateY(0px);
    border-color: none;
	background-color: rgba(0,0,0,1);
}
.wrap .bg-div .nav .nav-ul .logo-li{
	background-image: url(../images/logoeye.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	color:rgb(1, 35, 60);
	cursor: default;
}
.menu{
	cursor: pointer;
	height: inherit;
	line-height: 1.2rem;
}
.menu .glyphicon{
	display: inline-block;
	margin-left: 7rem
}
.bg-div{
	/*position: relative;*/
	width: 10rem;
	height: 0px;
}
.main-wrap{
	position: absolute;
	/*position: relative;*/
	margin-top:2rem;
	/*border:1px solid blue;*/
	/*height:auto;*/
}
.wrap .bg-div .main-wrap .content{
	position: absolute;
	width: 100%;
	margin-top:-1.4rem;
	/*height:100%;*/
	/*height: 9rem;*/
}
.wrap .bg-div .main-wrap .content .part{
	text-align: center;
	height: 4rem;
	float: none;
	/*border:1px solid black;*/
	box-sizing: border-box;
	color:white;
	box-shadow: 3px 4px  10px 10px rgba(0,0,0,.3);
	/*overflow: hidden;*/
	margin-top: 0.75rem;
}
.wrap .bg-div .main-wrap .content .part-content{
	/*position: relative;*/
	cursor: pointer;
	text-align: center;
	height: 100%;
	/*border:1px solid blue;*/
	box-sizing: border-box;
	/*background-color: rgba(36, 20, 65,.7);*/
	transition: all 500ms;
	/*padding-top: 20px;*/
	background-repeat: no-repeat;
	background-size: 100% 100%;
	/*transition: all 500ms;*/
}
.wrap .bg-div .main-wrap .content .part-content h3{
	box-sizing: border-box;
	line-height: 0.8rem;
	width: 2.5rem;
	height: 0.8rem;
	border: 0.08rem solid rgb(242,242,242);
	margin:0;
	/*background-color: rgba(51, 134, 179,.9);*/
	background-color: white;
	border-radius: 0.4rem;
	color:rgb(42, 48, 60);
	cursor: default;
	font-weight: bolder;
	text-align: center;
	/*margin-top: 0.7rem;*/
	transition: all 500ms;
	font-size: 0.2rem;
}
canvas{
	display: none;
}
.circle-img-wrap{
	position: absolute;
	animation: imgRotateZ  10s ease  infinite;
}
.circle-img,.circle-img-wrap{
	/*display: inline-block;*/
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 2.5rem;
	border-radius: 50% 50%;
	background-size: contain;
	background-repeat: repeat;
	background-position: center;
	/*margin:0 auto;*/
}

.wrap .bg-div .main-wrap .content .part-content .desc {
	width: 6rem;
	height: 3rem;
	/*overflow-x: scroll;*/
	font-size: 0.2rem;
	font-weight: bold;
    background-color: rgb(230,230,230);
    border-radius: 0.375rem;
    color: steelblue;
    display: inline-block;
    margin-top: -3.2rem;
    margin-left: -1.4rem;
    box-sizing: border-box;
    padding: 0.5rem;
    background-image: url(../images/7390837d036d3a8cb21b2ce0226da3ef.png);
    background-size: 0.75rem 0.75rem;
    background-repeat: no-repeat;
    background-position: 4.5rem 2rem;
    transition: all 500ms;
}
.wrap .bg-div .main-wrap .content .part-content .desc:hover{
	background-color: rgb(200,200,200);
}
.wrap .bg-div .main-wrap .content .part-content .desc a {
    color: #103b50;
    margin-top: 2.9rem;
    display: inline-block;
}
.wrap .bg-div .main-wrap .content .part-content .desc a:hover {
    color: #7363e8;
    text-decoration: none;
}
}
@keyframes imgRotateZ{
	from{
		transform: rotateZ(0deg);
	}
	to{
		transform: rotateZ(360deg);
	}
}